<script setup lang="ts">
const show = defineModel<boolean>({ required: true })
</script>

<template>
  <Transition
    leave-active-class="animate__animated animate__faster animate__fadeOut"
    enter-active-class="animate__animated animate__faster  animate__fadeIn"
  >
    <!-- <div
      v-if="show"
      class="fullscreen-modal padding-sm box-border"
    > -->
    <BScrollbar
      v-if="show"
      class="padding-sm fullscreen-modal box-border"
    >
      <slot />
    </BScrollbar>
    <!-- </div> -->
  </Transition>
</template>

<style scoped>
.fullscreen-modal {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 99;
  background-color: var(--el-bg-color-overlay);
}
</style>
